<template>
    <div @click="doubleClick">
        {{ count }}
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onRenderTracked, onRenderTriggered,watchEffect } from "vue"

let count = ref(1)
let data = ref()
const doubleClick = () => {
    data.value = count.value + 1
}

watchEffect(() => {
    data.value = count.value
   // console.log('data',data.value);
})
/**
 * 组件渲染跟踪到响应式数据触发
 */
onRenderTracked((e) => {
    //console.log('onRenderTracked', e);

})
/**
 * 响应式数据改变时触发
 */
onRenderTriggered((e) => {
    //console.log('onRenderTriggered', e);

})
</script>

<style scoped></style>
